<template>
  <div>
    <a-drawer
      title="下载队列"
      placement="right"
      :closable="false"
      width="600"
      :visible="this.visible"
      @close="onClose"
    >
      <a class='redo' @click='loadData' > <a-icon type="redo" />刷新 </a>
      <div class="table-operator">
        <a-dropdown v-if="selectedRowKeys.length > 0">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
          </a-menu>
          <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
        </a-dropdown>
      </div>
      <div>
        <a-table
          ref="table"
          size="middle"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          @change="handleTableChange">

        <span slot="action" slot-scope="text, record">
          <a v-if="record.isComplete == 1" @click="downloadfile(record)">下载</a>
        </span>

        </a-table>
      </div>
      <!-- table区域-end -->

    </a-drawer>
  </div>
</template>
<script>
  import '@/assets/less/TableExpand.less'
  import { PageListMixin } from '@/mixins/PageListMixin'
  import { postAction } from '@/api/manage'
  export default {
    props:['visible'],
    mixins:[PageListMixin],
    data() {
      return {
        columns:[
          {
            title: '文件名称',
            align:"center",
            dataIndex: 'fileName'
          },
          {
            title: '创建时间',
            align:"center",
            dataIndex: 'createTime'
          },
          {
            title: '准备进度',
            align:"center",
            dataIndex: 'isComplete',
            customRender: function (text) {
              if (text === 0) {
                return '处理中'
              }else if (text === 2) {
                  return '未配置下载接口'
              }else if (text === 3) {
                return '数据为空'
              } else {
                return '100%'
              }
            }
          },
          {
            title: '下载状态',
            align:"center",
            dataIndex: 'downStatus',
            customRender: function (text) {
              if (text === 0) {
                return '未下载'
              } else {
                return '已下载'
              }
            }
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"center",
            scopedSlots: { customRender: 'action' },
          },
        ],
        url: {
          list: window._CONFIG['domianJobURL']+ "/cnDownloadController/findPageList",
          deleteBatch: window._CONFIG['domianJobURL']+ "/cnDownloadController/deleteBatch",
          save: window._CONFIG['domianJobURL']+ "/cnDownloadController/saveOrUpdate",
        },
      }
    },
    watch:{
      visible(val){
        if (val!=undefined && val !='' && val){
          this.loadData()
        }
      }
    },
    methods: {
      onClose() {
        this.$emit("doDownload",false)
      },
      downloadfile(record){
        if (record && record.fileUrl) {
          let param = {... record}
          let that = this
          param.downStatus = 1
          //更新下载状态
          postAction(this.url.save, param).then(res => {
            //已经成功 更新状态
            window.open(record.fileUrl)
            this.loadData()
          })
        }else{
          this.$message.warning("未知的文件")
        }
      }
    },
  };
</script>
<style scoped>
.redo{
  position: absolute;
  top: 17px;
  right: 24px;
}
</style>